<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="f"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.2.1.js"></script>
<link rel="stylesheet" href="/css/bootstrap.css" >
<script src="/js/bootstrap.js"></script>
</head>
<body>
<f:form class="form-horizontal" id="insFrm" action="${pageContext.request.contextPath}/add" method="post" enctype="multipart/form-data" modelAttribute="bill">
	<h4>发薪单</h4>
	发薪单编号:<f:input path="code"/><f:errors path="code" cssStyle="color:red"></f:errors><br>
	发薪单名称:<f:input path="name"/><f:errors path="name" cssStyle="color:red"></f:errors><br>
	所属组织:<select name="companyId" id="companyId" onchange="companyChange(this)"></select><br>
	所属事业部:<select name="businessId" id="businessId" onchange="businessChange(this)"></select><br>
	所属部门:<select name="deptId" id="deptId"></select><br>
	发放总金额:<f:input path="acount"/><f:errors path="acount" cssStyle="color:red"></f:errors><br>
	计税标准文件:<input type="file" name="file"><br>
	
	<h4>发薪人员</h4>
	<input type="button" value="增加发薪人员" onclick="addLine()">
	<span id="sp"></span>
	<input type="button" value="提交" onclick="tj()">
</f:form>
<script type="text/javascript">

		var s = 0;
	function addLine(){
		$("#sp").append('<span class="sp">'+
				'员工姓名:<input type="text" name="users['+s+'].name">'+
				'员工类型:<select id="t_'+s+'" name="users['+s+'].type"></select>'+
				'发放金额:<input type="text" name="users['+s+'].price">'+
				'<input type="button" value="删除" onclick="deleLine(this)">'+
		'<br></span>')
		//追加枚举类下拉框
		$.post(
			"${pageContext.request.contextPath}/getTypes",
			function(msg){
				for(var i = 0;i<msg.length;i++){
					$("#t_"+s).append('<option value="'+i+'">'+msg[i]+'</option>')
				}
				s++;
			}
		)
		
		
	}
	function deleLine(lineDom){
		$(lineDom).parent().remove();
	}
	




	$(function(){
		//初始化所属组织
		initCompany();
	})
	function initCompany(){
		$.post(
			"${pageContext.request.contextPath}/getOrgan?parentId=0",
			{parentId:0},
			function (msg){
				var str='<option value="">==请选择==</option>';
				for(var i = 0;i<msg.length;i++){
					str+='<option value="'+msg[i].id+'">'+msg[i].name+'</option>'
				}
				$("#companyId").html(str);
			},
			"json"
		)
	}

	function companyChange(thiz){
		var parentId = $(thiz).val();
		$.post(
				"${pageContext.request.contextPath}/getOrgan",
				{parentId:parentId},
				function (msg){
					var str='<option value="">==请选择==</option>';
					for(var i = 0;i<msg.length;i++){
						str+='<option value="'+msg[i].id+'">'+msg[i].name+'</option>'
					}
					$("#businessId").html(str);
				},
				"json"
			)
	}
	function businessChange(thiz){
		var parentId = $(thiz).val();
		$.post(
				"${pageContext.request.contextPath}/getOrgan",
				{parentId:parentId},
				function (msg){
					var str='<option value="">==请选择==</option>';
					for(var i = 0;i<msg.length;i++){
						str+='<option value="'+msg[i].id+'">'+msg[i].name+'</option>'
					}
					$("#deptId").html(str);
				},
				"json"
			)
	}

	function tj(){
		var q = $(".sp").length;
		if(q>0){
			$("#insFrm").submit();
		}else{
			alert("至少添加一条发薪人员")
		}
	}
</script>
</body>
</html>